<template>
  <MainSlot>
    <template v-slot:searchForm>
      <SearchForm v-if="formItemList.length" :formItemList="formItemList" :unfoldFlag="unfoldFlag" @search="search"
        @isUnfold="(v) => { unfoldFlag = v }">
      </SearchForm>
    </template>
    <template v-slot:table>
      <ChooseHomeBase :categoryList="categoryList" @searchBar="searchBar"></ChooseHomeBase>
      <Table :propList="propList" :listData="tableData" :showFooter="false">
        <template v-slot:detail="{ row }">
          <div class="detail">
            {{ row.detail }}
          </div>
        </template>
      </Table>
    </template>
    <template v-slot:pagination>
      <Pagination @current-change="changeCurrentPage" :page="currentPage" :size="pageSize" :total="totalSize">
      </Pagination>
    </template>
  </MainSlot>
</template>

<script>
import MainSlot from "@/components-production-management/MainSlot";
import Pagination from '@/components-production-management/Pagination';
import SearchForm from '@/components-production-management/SearchForm';

import Table from "@/components/table/index.vue";
import ChooseHomeBase from "@/components/ChooseHomeBase/index.vue"

import { mymixin } from "@/utils/mixin";
import { mapGetters } from "vuex";

import staffApi from "@/api/basic-info-manage/staff/index";
import AbnormalDeathApi from "@/api/health-management/abnormal-death-management";
export default {
  name: "RiskOvervie",
  components: { Pagination, Table, MainSlot, SearchForm, ChooseHomeBase },
  mixins: [mymixin],
  data() {
    return {
      unfoldFlag:false,
      staffList: [],
      categoryList: [],
      searchParams: {
        staffName: ''
      },
      checkedIdList: [],
      listData: [],
      formItemList: [
        {
          label: '操作人',
          type: 'select',
          selectOptions: [],
          param: 'staffName',
          defaultSelect: '', // 下拉框默认选中项
          multiple: false,
          isShow: true
        }
      ],
      propList: [
        { prop: 'recorderName', label: "操作人", minWidth: '20', },
        { prop: 'operationType', label: "操作类型", minWidth: '20', },
        {  label: "操作说明" ,slotName:'detail' },
        { prop: 'recorderTime', label: "操作时间" , minWidth: '20',},
      ],
    };
  },
  computed: {
    ...mapGetters({
      judgePermission: "permission/judgePermission"
    })
  },
  watch: {},
  created() {
    this.categoryList = JSON.parse(sessionStorage.getItem('homeBaseList'))
  },
  mounted() {
    this.queryPageList();
    this.initData();
  },
  methods: {
    search(data) {
      this.searchParams = { ...data };
      this.queryPageList();
    },
    setFormOptions() {
      this.searchParams.staffName = null;
      let list = JSON.parse(JSON.stringify(this.formItemList));
      this.formItemList = []
      list.forEach((item, index) => {
        if (item.param.indexOf('staffName') !== -1) {
          let selectOptions = this.staffList.map(data => {
            return {
              text: data.staffName, value: data.staffName
            }
          })
          item.selectOptions = selectOptions;
        };

      });
      this.$nextTick(() => {
        this.$set(this, 'formItemList', list)
        console.log(this.formItemList)
      })
    },
    async initData() {
      const { data: staff } = await staffApi.queryByCondition({});
      if (staff !== undefined) {
        this.staffList = staff;
        this.setFormOptions();
      } else this.staffList = [];
    },
    searchBar() {
      this.queryPageList();
      this.initData();
    },
    resetSearchParams() {
      this.searchParams = {};
      this.queryPageList();
    },
    exportData() {
      AbnormalDeathApi.exportRecord({ ...this.searchParams }).then(res => {
        // data就是接口返回的文件流
        let data = res.data
        if (data) {
          this.getFileNameAndDownload(res)
        } else {
          console.log('error', data)
        }
      })
    },

    queryPageList() {
      let params = {
        page: this.currentPage,
        size: this.pageSize,
        entity: { ...this.searchParams }
      };
      AbnormalDeathApi.queryPondOperationRecord(params).then(res => {
        if (res.success === true) {
          let data = res.data || {};
          this.totalSize = data.totalElements;
          // 赋值数组
          this.tableData = data.content;
          this.addblankmet();
        }
      });
    },
    changeCurrentPage(currentPage) {
      this.currentPage = currentPage;
      this.queryPageList();
    },
  }
};
</script>

<style lang="scss" scoped>

.tableSlot{
  .content{
    height: calc(100% - 70px);
  }
}
.detail{
  min-height: 40px;
  white-space: wrap !important;
  text-align: left;
}
</style>
